﻿<div id="cc" class="easyui-layout" data-options="fit:true, border:false">
    <div data-options="region:'north',title:'查询条件',split:true" style="height: 80px;">
        <div style="padding: 10px;">
            <form id="EmployeeIndex_QueryForm">
                员工编号：<input name="ObjectID" type="text" style="width: 120px;" />
                姓名：<input name="ChName" type="text" style="width: 120px;" />
                性别：
                <select class="easyui-combobox" name="Sex" style="width: 100px;"
                        data-options="editable:false,panelHeight: 'auto'">
                    <option value="">全部</option>
                    <option value="男">男</option>
                    <option value="女">女</option>
                </select>
                身份证号：<input name="IdentityId" type="text" style="width: 120px;" />
                手机号码：
                <input name="query_SJHM" type="text" id="query_SJHM" style="width: 120px;" />
                <a href="javascript:void(0);" class="easyui-linkbutton" onclick="employee.query()"
                   data-options="iconCls:'icon-search', plain: true">
                    查询
                </a>
                <a href="javascript:void(0);" class="easyui-linkbutton" onclick="employee.clear()"
                   data-options="iconCls:'icon-clear', plain: true">
                    清除
                </a>
            </form>
        </div>
    </div>
    <div data-options="region:'center',title:'人事信息'">
        <table id="EmployeeIndex_List" class="easyui-datagrid"
               data-options="fit:true,singleSelect:true,border:false,url:employee.action.query">
            <thead data-options="frozen:true">
                <tr data-options="frozen:true">
                    <th data-options="field:'ObjectID',width:100">员工编号</th>
                    <th data-options="field:'ChName',width:120">姓名</th>
                    <th data-options="field:'IdentityId',width:120">身份证</th>
                </tr>
            </thead>
            <thead>
                <tr>
                    <th data-options="field:'Sex',width:100">性别</th>
                    <th data-options="field:'Birthday',width:100">生日</th>
                    <th data-options="field:'Nationality',width:100">民族</th>
                    <th data-options="field:'Education',width:100">学历</th>
                </tr>
            </thead>
        </table>
    </div>
</div>

<script type="text/javascript">
    var employee = {
        action: {
            query: '@Url.Action("Query", "Employee")'
        },
        query: function () {
            var queryParams = czx.serilizeObject('#EmployeeIndex_QueryForm');
            $('#EmployeeIndex_List').datagrid('load', queryParams).datagrid('clearSelections');
        },
        clear: function() {
            $('#EmployeeIndex_QueryForm').form('clear');
            employee.query();
        }
    };
</script>